﻿//载入基础页面
{extend name="common/base" /}

//页面单独CSS
{block name="CustomCSS"}
<link rel="stylesheet" href="__STATIC__/vendors/css/datatables/datatables.min.css">

{/block}

//页面单独JS
{block name="CustomJS"}
<script src="__STATIC__/vendors/js/datatables/datatables.min.js"></script>
<script src="__STATIC__/vendors/js/datatables/dataTables.buttons.min.js"></script>
<script src="__STATIC__/vendors/js/datatables/jszip.min.js"></script>
<script src="__STATIC__/vendors/js/datatables/buttons.html5.min.js"></script>
<script src="__STATIC__/vendors/js/datatables/pdfmake.min.js"></script>
<script src="__STATIC__/vendors/js/datatables/vfs_fonts.js"></script>
<script src="__STATIC__/vendors/js/datatables/buttons.print.min.js"></script>
<script src="__STATIC__/vendors/js/noty/noty.min.js"></script>
<script>

    (function ($) {
    'use strict';
    // ------------------------------------------------------- //
    // Auto Hide
    // ------------------------------------------------------ //    
        $(function () {
            //定义表格
            var table = $('#table').DataTable({
                language: {
                    "url": "__STATIC__/vendors/js/datatables/cn.json"
                },
                lengthMenu: [
                    [10, 15, 20, -1],
                    [10, 15, 20, "所有"]
                ],//分页数目
                "columnDefs": [
                    { "orderable": false, "targets": 5 }//禁止排序
                ]
            });
        });
    })(jQuery);

    //打开删除确认的noty
    function delcfm(url,name) {
        var n = new Noty({
            type: "error",
            text: '确定删除此条记录吗?</br>此操作将删除此款车型：</br>'+name+'</br>请慎重操作！ ',
            progressBar : true, 
            animation: {
                open: "animated bounceInRight",
                close: "animated bounceOutRight"
            },
            buttons: [
                Noty.button('确定', 'btn btn-danger', function () {
                    urlSubmit(url,name);//确认后执行urlSubmit()完成实际执行
                    n.close();
                }, {id: 'button1', 'data-status': 'ok'}),

                Noty.button('取消', 'btn btn-shadow', function () {
                    n.close();
                })
            ]
        }).show();
    };   
    //提交删除链接
    function urlSubmit(url,name){
        var n = new Noty({
            type: "error",
            text: '再次确认需要删除名称为：</br>'+name+' 的车型吗！</br>请慎重操作！ ',
            progressBar : true, 
            animation: {
                open: "animated bounceInRight",
                close: "animated bounceOutRight"
            },
            buttons: [
                Noty.button('确定', 'btn btn-danger', function () {
                    $.post(url, function(data, status){
                        if (status == "success") {
                            if (data == "ok") {
                                //提交成功后调用
                                new Noty({
                                    type: "success",
                                    layout: "topRight",
                                    text: "成功删除一条数据",
                                    progressBar: true,
                                    timeout: 2500,
                                    animation: {
                                        open: "animated bounceInRight",
                                        close: "animated bounceOutRight"
                                    },
                                    callbacks: {
                                        afterShow: function() {
                                            window.location.reload();
                                        },
                                    }
                                }).show();
                            }else{
                                //提交失败后调用
                                new Noty({
                                    type: "error",
                                    layout: "topRight",
                                    text: "数据删除失败",
                                    progressBar: true,
                                    timeout: 2500,
                                    animation: {
                                        open: "animated bounceInRight",
                                        close: "animated bounceOutRight"
                                    }
                                }).show();
                            }
                        }
                    });//确认后执行urlSubmit()完成实际执行
                    n.close();
                }, {id: 'button1', 'data-status': 'ok'}),

                Noty.button('取消', 'btn btn-shadow', function () {
                    n.close();
                })
            ]
        }).show();
    };
</script>
{/block}

//页面名称
{block name="PageName"}
车型列表
{/block}

//自定义Modal
{block name="Modal"}
{/block}

//主页面
{block name="main"}
<div class="row">
    <div class="col-xl-12">
        <!-- Export -->
        <div class="widget has-shadow">
            <div class="widget-header bordered d-flex align-items-center">
                <h2>车型列表</h2>
                <button type="button" class="btn btn-primary" onclick="javascript:window.location.href='{:url('Car/create')}'"/>添加</button>
            </div>
            <div class="widget-body">
                <div class="table-responsive">
                    <table id="table" class="table mb-0">
                        <thead>
                            <tr>
                                <th>品牌</th>
                                <th>车系</th>
                                <th>配置</th>
                                <th>型号</th>
                                <th>价格</th>
                                <th>上架</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            {volist name="car" id="list" empty="暂时没有数据" }
                            <tr>
                                <td>{$list.brand}</td>
                                <td>{$list.vehicle}</td>
                                <td>{$list.config}</td>
                                <td>{$list.model}</td>
                                <td>{$list.price}</td>
                                <td>{if $list.valid == 1}是{else}否{/if}</td>
                                <td class="td-actions">
                                    <div class="btn-group" role="group">
                                        <button type="button" class="btn btn-warning btn-sm mr-1 mb-2"  onclick="javascript:window.location.href='{:url('Car/edit',['id' => $list.id])}'">编辑</button>
                                        <button type="button" class="btn btn-danger btn-sm mr-1 mb-2" onClick="delcfm('{:url('Car/delete',['id' => $list.id])}','{$list.vehicle} {$list.config}')">删除</button>
                                    </div>
                                </td>
                            </tr>
                            {/volist}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- End Export -->
    </div>
</div>

<!-- End Centered Modal -->
{/block}

